<template>
  <div class="refine_dutysum">
    <h2 class="titleblue">值班总结列表</h2>
    <div class="contant">
      <el-row>
        <el-button type="primary" class="create" @click="addSum">新建值班总结</el-button>
        <div class="filter-div">
          <div class="search-wrap">
            <el-input prefix-icon="el-icon-search" placeholder="搜索值班总结" v-model="search"
                      class="plansearch">
              <!--<i slot="suffix" @click='searchGroup'>搜索</i>-->
              <span slot="append" @click="searchGroup">搜索</span>
              <!--<template slot="append">搜索</template>-->
            </el-input>
          </div>
          <label>所属机构</label>
          <el-select v-model="dutyGroup" clearable placeholder="机构选择" class="select-width-100" @change="dpChanges">
            <el-option v-for="item in groupOption" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
          <el-select v-model="dutyDept" clearable placeholder="部门选择" class="select-width-100" @change="searchGroup">
            <el-option v-for="item in deptOption" :key="item.d_id" :label="item.name" :value="item.d_id">
            </el-option>
          </el-select>

          <el-date-picker v-model="date_choose" align="right" type="date" placeholder="选择日期"
                          :picker-options="pickerOptions1" class="select-width-100"
                          @change="searchGroup">
          </el-date-picker>
        </div>
      </el-row>
      <!--<data-table :page='currentPage' :head="thead" :data="tableData" :actions="['edit','status','del','reset']"-->
      <!--@callback="dataAction"></data-table>-->
      <!--<data-table :page='currentPage' :head="thead1" :data="tableData1" :operate="toptions" @callback="manipulate"
                  :actions="['edit','download','view','del']"
                  class="intendance-table"></data-table>-->
      <el-table border stripe :data="tableData1" style="width: 100%" class="intendance-table">
        <el-table-column prop="id" label="序号" align="center" width="60">
          <template slot-scope="scope">
            <span v-if='scope.$index!=9'>{{(currentPage-1).toString()+parseInt(scope.$index+1)}}</span>
            <span v-else>{{currentPage+'0'}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="dutyStart" label="值班开始时间" align="center">
        </el-table-column>
        <el-table-column prop="dutyEnd" label="值班结束时间" align="center">
        </el-table-column>
        <el-table-column prop="usernames" label="值班人员" align="center">
        </el-table-column>
        <el-table-column prop="createTime" label="填写时间" align="center">
          <template slot-scope="scope">
            <span>{{$m(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss')}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="createUserName" label="填写人员" align="center">
          <template slot-scope="scope">
            <span>{{scope.row.createUserName ? scope.row.createUserName : scope.row.organiza.name}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="operate" label="操作" align="center" width="140">
          <template slot-scope="scope">
            <el-button size="mini" type="text"
                       @click="manipulate({data: scope.row, index: scope.$index, action: 'edit'})">提交
            </el-button>
            <el-button size="mini" type="text"
                       @click="manipulate({data: scope.row, index: scope.$index, action: 'view'})">查看
            </el-button>
            <el-button size="mini" v-if="delFlag(scope.row)" type="text"
                       @click="manipulate({data: scope.row, index: scope.$index, action: 'del'})">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                     :current-page.sync="currentPage" layout="total,prev, pager, next, jumper"
                     :total="total" background>
      </el-pagination>
    </div>
    <!--<router-view @close="close" :dutylog="dutylog" :id="ddid" ref="dutyInfo" @update='update'></router-view>-->
    <el-dialog title="" :visible.sync="adddialog" width="80%" append-to-body @close="close1">
      <span>
        <!--<keep-alive v-if='xinde'>-->
          <!--<transition name="move" mode="out-in">-->
            <!--<router-view :id='ddid' :dutylog="dutylog" @update='update' @close="close"></router-view>-->
          <!--</transition>-->
        <!--</keep-alive>-->
        <router-view ref="dutyInfo" :id="ddid" :dutylog="dutylog" @update='update' @close="close"></router-view>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import DataTable from '@/components/common/DataTable.vue'
  import * as dutyDescriptionService from '@/services/DutyDescriptionService.js'
  import * as orgService from '@/services/OrganizationService'
  import moment from 'moment'

  export default {
    components: {
      'data-table': DataTable
    },

    data: function () {
      return {
        search: '',
        dutyGroup: '',
        dutylog: '',
        date_choose: '',
        currentPage: 1,
        adddialog: false,
        xinde: false,
        groupOption: [],
        dutyDept: '',
        deptOption: [],
        pickerOptions1: {
          shortcuts: [{
            text: '今天',
            onClick (picker) {
              picker.$emit('pick', new Date())
            }
          }, {
            text: '昨天',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24)
              picker.$emit('pick', date)
            }
          }, {
            text: '一周前',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', date)
            }
          }]
        },
        thead1: [
          {
            name: '值班开始时间',
            prop: 'dutyStart',
            width: '200'
          },
          {
            name: '值班结束时间',
            prop: 'dutyEnd',
            width: '200'
          },
          {
            name: '值班人员',
            prop: 'usernames'
          },
          {
            name: '填写人',
            prop: 'fullname',
            width: '100'
          },
        ],
        tableData1: [],
        total: 0,
        ddid: '',
        toptions: [{name: '编辑', prop: 'edit'}, {name: '查看', prop: 'look'}, {name: '下载', prop: 'download'}],
      }
    },
    created () {
      this.getData(0)
      this.getSelect()
    },
    methods: {
      delFlag(data) {
          var a = this.$m()
          var b = this.$m(data.createTime)
          if (a.diff(b, 'days') <= 3 && data.createUserName == this.$profile.fullname) {
              return true
          } else {
              return false
          }
      },
      getData (val, query) {
        dutyDescriptionService.search(val, query).then(res => {
          var dutyList = res.data.map(function (item) {
            item.dutyEnd = item.dutyEnd ? moment(item.dutyEnd).format('YYYY-MM-DD HH:mm:ss') : ''
            item.dutyStart = item.dutyStart ? moment(item.dutyStart).format('YYYY-MM-DD HH:mm:ss') : ''
            return item
          })
          this.tableData1 = dutyList
          this.total = parseInt(res.headers['x-total-count'])
        }).then(res => {
          this.currentPage = val * 1 + 1
        })
        // this.$axios.get(this.$config['dutylogList'], {
        //   params: {
        //     skey: localStorage.getItem('auth'),
        //     page: val,
        //     counts: 10,
        //     date: this.time,
        //     orgId: this.groupname || this.type,
        //     dutyname: this.groupsearch,
        //   }
        // }).then((res) => {
        //   this.tableData1 = res.data.content.ships
        //   this.totalPage = res.data.content.shipSize
        //   for (var i of this.tableData1) {
        //     i.createdate = this.formatDate(i.createdate)
        //     // this.isEdit=i.isEdit
        //   }
        // })
      },
      getSelect () {
        let orgQuery = ''
        // 局领导，海事处，执法大队默认查看本部门的人
        if (this.$profile.organiza.businessOrg === 0 || this.$profile.organiza.businessOrg === 3 || this.$profile.organiza.businessOrg === 4) {
          if (this.$profile.organiza.parentId !== null) {
            orgQuery = 'id=_=' + this.$profile.organiza.parentId + ';parentId=_=' + this.$profile.organiza.parentId
          } else {
            orgQuery = 'id=_=' + this.$profile.organiza.id + ';parentId=_=' + this.$profile.organiza.id
          }
        }
        orgService.findAll(orgQuery).then(async res => {
          await res.data.sort((a, b) => {
            if (a.businessOrg < b.businessOrg) {
              return -1
            }
            if (a.businessOrg > b.businessOrg) {
              return 1
            }
            return 0
          })
          this.groupOption = res.data
        })
      },
      handleQuery () {
        var query = ''
        if (this.dutyDept) {
          query += 'organiza.id==' + this.dutyDept
        } else if (this.dutyGroup) {
          query += 'organiza.id==' + this.dutyGroup
        }
        if (this.date_choose) {
          if (query.length) {
            query += ';'
          }
          query += 'today==' + this.$m(this.date_choose).toISOString()
        }
        if (this.search) {
          if (query.length) {
            query += ';'
          }
          query += 'usernames=like=' + this.search
          // query += ';users=_like=' + this.groupsearch
        }
        return query
      },
      addSum () {
        this.xinde = true
        this.adddialog = true
        this.$router.push({name: 'DutySumEdit'})
        this.dutylog = 'createDuty'
      },
      manipulate (param) {
        if (param.action == 'edit') {
          this.$router.push('/duty-sum/edit')// , query: {id: item.dId}}
          this.dutylog = 'editDuty'
          this.ddid = param.data.id
          this.xinde = true
          this.adddialog = true
        }
        if (param.action == 'download') {

        }
        if (param.action == 'view') {
          this.$router.push('/duty-sum/edit')// , query: {id: item.dId}}
          this.dutylog = 'lookDuty'
          this.ddid = param.data.id
          this.xinde = true
          this.adddialog = true
        }
        if (param.action == 'del') {
          // this.ddid = param.data.id
          dutyDescriptionService.deleteById(param.data.id).then(res => {
            this.$message({
              type: 'success',
              message: '删除成功!'
            })
            this.getData(0)
          })
        }
      },
      update () {
        this.getData(0)
        this.adddialog = false
      },
      async dpChanges (val) {
        this.currentPage = 1
        this.dutyDept = ''
        this.deptOption = []
        for (var i of this.groupOption) {
          if (i.id == val && i.sub) {
            this.deptOption = i.sub
          }
        }
        let query = await this.handleQuery()
        this.getData(0, query)
      },
      async searchGroup () {
        this.currentPage = 1
        let query = await this.handleQuery()
        this.getData(0, query)
      },
      handleSizeChange (val) {
        this.getData(val - 1)
      },
      handleCurrentChange (val) {
        this.currentPage = val
        this.getData(val - 1)
      },
      close () {
        this.adddialog = false
      },
      close1 () {
        this.adddialog = false
        this.$router.go(-1)
      }
    }
  }
</script>

<style lang="scss" scoped>
  .refine_dutysum {
    width: 100%;
    display: inline-block;

    .filter-div {
      float: right;
      width: 900px;
    }

    .select-width-100 {
      width: 160px;
    }

    .el-table {
      margin-top: 20px;
    }

    .intendance-table {
      margin-top: 20px;
    }

    @media only screen and(min-width: 1024px) and (max-width: 1024px) {
      .filter-div {
        width: 100%
      }
    }
  }
</style>
